<!--
 * @Description: 
 * @Author: nxd
 * @Date: 2023-01-01 20:00:01
 * @LastEditors: nxd
 * @LastEditTime: 2023-01-14 10:35:14
-->
<template>
  <div class="table">
    <div class="fb">
   <var-app-bar :elevation="false" color="white" title="意见反馈" title-position="center" text-color="#000000">
      <template #left>
        <var-button @click="resetup" color="transparent" text-color="#ffffff" round text>
          <var-icon color="#D3D3D3" name="chevron-left" :size="24" />
        </var-button>
      </template>
    </var-app-bar>
  </div>
<div class="text">
    <var-input placeholder="&nbsp&nbsp&nbsp请详细写下你的建议和感想吧" textarea v-model="value" line="false" type="text">
        </var-input>
        <var-uploader v-model="files" :maxsize="1024*27" @oversize="handleOversize" />
        <p class="warn">&nbsp&nbsp&nbsp文件大小不超过27MB</p>
</div>
</div>
</template>

<script setup lang='ts'>
    import router from '../../../router/index'
    import { ref } from 'vue'
    import { Snackbar } from '@varlet/ui'
    function resetup(){
  router.push('/setup')
  console.log('返回个人设置页');
  
 };
 
//文本框
const value = ref('')
//文件上传
const files = ref([])
const handleOversize = () => {
  Snackbar.warning('文件大小超出限制')
}
 </script>

<style lang="less" >
.table{
  .fb{
    .var-app-bar{
    height:60px;
  }
  .var-app-bar__title{
    font-weight:500;
    font-size:18px
  }
  }
.text{
    background-color: #ffffff;
    .var-input__textarea-placeholder{
      font-size:15px;
    }
    .var-input__line{
      display:none
    }
    .var-input__wrap{
     .var-input--placeholder-hint{
      font-size:15px;
      color:#888
     }
    }
    .var-uploader__action{
      margin-left:10px
    }
    .var-uploader__file{
      margin-left:10px
    }
    .warn{
      font-size:15px;
      color:#888;
      padding-bottom: 20px
    }
}
}
</style>